<template>
    <div>
        <el-upload :action="uploadUrl" list-type="picture-card" :on-preview="handlePictureCardPreview"
            :on-remove="handleRemove" :on-success="handleSuccess" :file-list="fileList" ref="upload" multiple>
        </el-upload>
        <i class="el-icon-plus"></i>
 
    </div>

</template>
<script>
import { uploadUrl, host } from '@/api/base'
export default {
    props: {
        fileList: {
            type: Array,
            default: function () {
                return []
            }
        }

    },
    data() {
        return {
            uploadUrl,
            dialogImageUrl: '',
            dialogVisible: false,
            fileList: []
        };
    },
    methods: {
        handleRemove(file, fileList) {
            console.log(file, fileList);
        },
        //上传成功
        handleSuccess(response, flie, fileList) {
            console.log(response, flie, fileList);
            let url = response.resultValue;
            let imgUrl = host + "/" + url;
            console.log("图片访问地址：" + imgUrl);
            this.$emit('sendImg', imgUrl)

        },
        handlePictureCardPreview(file) {
            this.dialogImageUrl = file.url;
            this.dialogVisible = true;
        },
        clear() {
            this.fileList = []
            // 也可以使用下面的这个
            // this.$refs.upload.clearFiles();

        }
    }
}
</script>